<template>
  <a-row justify="center"  class="article">
    <a-col span="24" :md="{span : 18}" :xl="{span : 16}">
      <a-card title="公告详情" :loading="loading" class="card" size="small" >
        <template #extra>
          <a @click="() => {$router.go(-1)}" href="#">返回</a>
        </template>
        <preview-vditor v-if="!loading" :data="announcement.content"/>
        <a-skeleton v-else  :paragraph="{ rows: 15}" />
      </a-card>
    </a-col>
  </a-row>
  <Outline/>
  <a-back-top />
</template>

<script lang="ts" setup>
import PreviewVditor from "@/components/PreviewVditor"
import {getAnnouncement} from "@/api/home";
const announcement = ref();
const loading = ref<boolean>(true)
onMounted(() => {
  init();
})

const init = async () => {
  loading.value = true;
  const articleId = useRoute().params.id as string
  const res = await getAnnouncement(articleId);
  announcement.value = res.data
  loading.value = false;
}


</script>


<style lang="scss" scoped>

</style>
